<template>
  <div class="page-style">
    <aside>
      <el-form label-width="100px" :model="form" :inline="true">
        <el-form-item label="条码规格">
          <el-select v-model="form.type" placeholder="请选择条码规格">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="输入条码">
          <el-input v-model="form.code_num" placeholder="请输入条形码" style="width:250px" clearable />
          <el-button type="primary" @click="getCodeNumberFlowFun">查询</el-button>
        </el-form-item>
      </el-form>
    </aside>
    <tab :tab-data="tabData" />
    <pagination :total="total" @pagination="pagination" />
  </div>
</template>

<script>
// import radioComp from '@/components/radioComp'
import tab from './components/bar-code-tracing/bar-code-tracing-tab'
import { getCodeNumberFlow } from '@/api/wms'
import pagination from '@/components/Pagination'
export default {
  components: {
    // radioComp,
    tab,
    pagination
  },
  data() {
    return {
      total: 0,
      p: 1,
      num: 10,
      tabData: [],
      form: {
        type: '',
        code_num: ''
      },
      value: '',
      options: [
        {
          value: 1,
          label: '大码'
        },
        {
          value: 2,
          label: '中码'
        },
        {
          value: 3,
          label: '小码'
        }
      ]
    }
  },
  computed: {

  },
  methods: {
    radioVal(val) {
      console.log(val)
      this.radioValue = val
    },
    pagination(val) {
      this.p = val.page
      this.num = val.limit
      this.getCodeNumberFlowFun()
    },
    getCodeNumberFlowFun() {
      const data = {
        type: this.form.type,
        bar_code_num: this.form.code_num,
        p: this.p,
        num: this.num
      }
      getCodeNumberFlow(data).then(res => {
        console.log(res)
        this.total = Number(res.count)
        this.tabData = res.list
      })
    }
  }
}
</script>

<style lang="scss" scoped>
  .text-style {
    font-size: 12px;
    // font-weight: bold;
    color: #000;
  }
</style>
